// import HomeView from "../views/HomeView.vue";
// import NewPage from "../views/NewPage.vue";
// import AboutView from "../views/AboutView.vue";

// import beforeEnter from "./beforeEnter";

// 通过路由配置，将vue组件转为对应的页面，实现页面的切换操作
export default [
  {
    path: "/",
    // 自动完成路径切换=>重定向
    redirect: "/login",
  },
  {
    path: "/login",
    name: "login",
    component: () => import("../views/LoginView.vue"),
  },
  {
    // / 用于定义默认路由
    // path: "/",
    path: "/home",
    // 为路径提供名称
    name: "home",
    // component: HomeView,
    component: () =>
      import(/* webpackChunkName: "HomeView" */ "../views/HomeView.vue"),
    // 在全局路由配置时，为当前路由专门提供一个进入守卫
    // beforeEnter: beforeEnter,
  },
  {
    path: "/about",
    name: "about",
    // component: AboutView,

    // 路由的代码分解(拆包) => 路由懒加载
    // 生成一个 chunk 包文件，以设置的 文件名.hash指纹.js，多个路由组件的分包名称相同时，会合并成一个文件
    // 实现用户操作路由时，根据访问的路由选择性的加载对应的组件
    // component: function () {
    //   return import("../views/AboutView.vue");
    // },
    // 基于ES6箭头函数简化
    // component: () =>
    //   import(/* webpackChunkName: "AboutView" */ "../views/AboutView.vue"),
    component: () => import("../views/AboutView.vue"),
    // beforeEnter: beforeEnter,
  },
  {
    // 设置地址
    path: "/new",
    name: "new",
    // 组件
    // component: NewPage,
    // component: () =>
    //   import(/* webpackChunkName: "NewPage" */ "../views/NewPage.vue"),
    component: () =>
      import(/* webpackChunkName: "group-a" */ "../views/NewPage.vue"),
    // 为当前路由定义子路由
    children: [
      {
        // path 取值从二级路由开始，可以使用相对父路由的地址定义规则
        //      => 绝对路径：从服务器的资源根目录 / 开始定义的路径
        //      => 相对路径：删除 / 直接定义路径名称
        // path: "/one",
        path: "one",
        name: "newOne",
        component: () =>
          import(
            /* webpackChunkName: "group-a" */ "../views/new/NewOneView.vue"
          ),
      },
      {
        // path: "/two",
        path: "two",
        name: "newTwo",
        component: () =>
          import(
            /* webpackChunkName: "group-a" */ "../views/new/NewTwoView.vue"
          ),
      },
      {
        // path: "/three",
        path: "three",
        name: "newThree",
        component: () =>
          import(
            /* webpackChunkName: "group-a" */ "../views/new/NewThreeView.vue"
          ),
      },
    ],
  },
  {
    path: "/games",
    name: "games",
    component: () => import("../views/GamesListPage.vue"),
  },
  {
    path: "/detail",
    name: "detail",
    component: () => import("../views/GamesDetailPage.vue"),
  },
  {
    path: "/detail/rest/:id",
    name: "rest",
    component: () => import("../views/GamesDetailRest.vue"),
  },
  {
    path: "/auth",
    name: "auth",
    component: () => import("../views/AuthView.vue"),
    children: [
      {
        path: "child",
        name: "authChild",
        component: () => import("../views/AuthChildView.vue"),
      },
    ],
  },
  {
    path: "/route",
    name: "route",
    component: () => import("../views/route/RouteBox.vue"),
    children: [
      {
        path: "leave",
        name: "leave",
        component: () => import("../views/route/CompoentLeaveView.vue"),
      },
      {
        path: "update",
        name: "update",
        component: () => import("../views/route/CompoentUpdateView.vue"),
      },
      {
        path: "enter",
        name: "enter",
        component: () => import("../views/route/CompoentEnterView.vue"),
      },
    ],
  },
  {
    path: "/*",
    name: "notFound",
    component: () =>
      import(/* webpackChunkName: "group-a" */ "../views/NotFoundView.vue"),
  },
];
